﻿
@{
    ViewData["Title"] = "Form";
    Layout = "~/Views/Shared/_Index.cshtml";
}
@model Atlass.Framework.Models.cms_template;
<link href="~/plugins/codemirror/doc/docs.css" rel="stylesheet" />
<link href="~/plugins/codemirror/codemirror.css" rel="stylesheet" />
<link href="~/plugins/zTree_v3/css/bootstrapStyle/bootstrapStyle.css" rel="stylesheet" />
<div class="ibox">
    <div class="ibox-content">
        <form>
            <input type="hidden" id="id" name="id" value="@(Model.id)" />
            <div class="row">
                <div class="col-sm-10 col-sm-offset-2">
                    <div class="m-b-md">
                        <h2 id="TitleHeader">添加模板</h2>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-10 col-sm-offset-1">
                    <div class="row">
                        <div class="col-sm-10">
                            <dl class="dl-horizontal">
                                <dt style="margin-top: 8px;">模板类型：</dt>
                                <dd>
                                    @Html.DropDownList("pid", ViewBag.TempCategory as SelectList, new { @class = "form-control", @style = "width:250px;" })
                                </dd>
                            </dl>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-5">
                            <dl class="dl-horizontal">
                                <dt style="margin-top: 8px;">模板名称：</dt>
                                <dd>
                                    <input type="text" style="width:350px;" name="template_name" id="template_name" value="@(Model.template_name)" class="form-control" data-rule="required">
                                    <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 这里写点提示的内容</span>
                                </dd>
                                <dt style="margin-top: 8px;">
                                    模板文件：
                                </dt>
                                <dd>
                                    <input type="text" style="width:350px;" name="template_file" id="template_file" value="@(Model.template_file)" class="form-control" data-rule="required">
                                    <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 路径以/分隔，文件名以T_开头例：(T_新闻详情.html)</span>
                                </dd>
                            </dl>
                        </div>
                        <div class="col-sm-7" id="fileName" style="display:none;">
                            <dl class="dl-horizontal">
                                <dt style="margin-top: 8px;">生成文件名：</dt>
                                <dd>
                                    <input type="text" style="width:350px;" name="file_name" id="file_name" value="@(Model.file_name)" class="form-control">
                                    <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 路径以/分隔，例：(search/search.html)</span>
                                </dd>
                            </dl>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-10 col-sm-offset-1">
                            <textarea id="template_code">@(Model.template_content)</textarea>
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="footerbar">
                        <div class="col-sm-12 col-sm-offset-3">
                            <button class="btn btn-primary" type="button" onclick="save();">保存内容</button>
                            <button class="btn btn-white" type="button" onclick="cancel()">取消</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
@section scripts{
    <script src="~/plugins/codemirror/codemirror.js"></script>
    <script src="~/plugins/codemirror/addon/scroll/simplescrollbars.js"></script>
    <script src="~/plugins/codemirror/mode/xml/xml.js"></script>
    <script src="~/plugins/codemirror/mode/css/css.js"></script>
    <script src="~/plugins/codemirror/mode/htmlmixed/htmlmixed.js"></script>
    <script>
        var editor;
        $(function () {
            var id = $('#id').val();
            if (id) {
                $('#TitleHeader').text("修改模板");
            }
            $('#pid').on("change", function () {
                var tplCategory = $('#pid').val();
                if (tplCategory == '1' || tplCategory == '4') {
                    $('#fileName').show();
                } else {
                    $('#fileName').hide();
                }
            });
            $('#pid').change();
            //editor.setValue("");    //给代码框赋值
            //editor.getValue();    //获取代码框的值
            editor = CodeMirror.fromTextArea(document.getElementById("template_code"), {
                lineNumbers: true,
                model: 'htmlmixed',
                scrollbarStyle: 'native',
                matchBrackets: true,
                indentUnit: 2,
                indentWithTabs: true,
                selectionPointer: true

            });
            editor.setSize('1100px', '600px'); 
        });

        function save() {
            var model = {
                id: $('#id').val(),
                pid: $('#pid').val(),
                template_name: $('#template_name').val(),
                template_file: $('#template_file').val(),
                file_name: $('#file_name').val(),
            };
            if (model.pid == '0') {
                if (!model.template_name) {
                    layer.alert('请填写模板类型');
                    return;
                }
            }
            if (!model.template_name) {
                layer.alert('请填写模板名称');
                return;
            }
            if (!model.template_file) {
                layer.alert('请填写模板文件');
                return;
            }

            model.template_content = editor.getValue();
            //console.log(model);

            jutils.ajaxPost('/cms/TemplateCode/Save', model, function (res) {
                if (res.status) {
                    cancel();
                }
            });
        }

        function cancel() {
            parent.$.altasTab.close('vtemplate');
        }
    </script>

}


